import React,{useRef} from "react"
import {connect} from "react-redux"
import {addTodo} from "../actions";

let AddTodo = ({dispatch})=>{
    let inputRef = useRef(null);
    return (
        <div>
            <form
                onSubmit={e=>{e.preventDefault();
                    if(!inputRef.current.value.trim()){return}
                    dispatch(addTodo(inputRef.current.value));
                    inputRef.current.value = ''
                }}
            >
                <input type="text" ref={inputRef}/>
                <button type="submit">add todo</button>
            </form>
        </div>
    )
};

AddTodo = connect()(AddTodo);
export default AddTodo;